<template>
  <div id='components-layout-demo-basic'>
    <a-layout class='main-layout'>
      <!--      <a-layout-header>花匠铺</a-layout-header>-->
      <a-layout-content>
        <a-card style='width: 100%;display: inline'>
          <div style='width: 100%; '>
            <img
              slot='cover'
              alt='example'
              src='~@/assets/nyncb_logo_1.png'
              style='margin-top: 10px;width: 100%;'
            />
            <img
              slot='cover'
              alt='example'
              src='~@/assets/nync_logo2.jpg'
              style='width:50%;margin: 10px'
            />
          </div>


          <!--            src="~@/assets/hjp/hjp_detail.png"-->

          <a-tag color='#87d068' style='width: 50%;margin: 20px;'>
            公司介绍
          </a-tag>
          <a-card-meta title='' style='text-align: left;text-indent:2em;background: #fdfff5;padding:8px;'
                       description='  云南云天化现代农业发展有限公司成立于2020年06月30日，注册地位于云南省昆明市晋宁区昆阳街道永乐大街东侧国家磷资源开发利用工程技术研究中心6楼，法定代表人为陆龙华。'>
          </a-card-meta>
          <a-card-meta title='' style='text-align: left;text-indent:2em;background: #fdfff5;padding:8px;'
                       description='  公司以蔬菜种植；水果种植；农产品的生产、销售、加工、运输、贮藏及其他相关服务；豆类种植；薯类种植；农业生产资料的购买、使用；肥料销售；农林牧渔业废弃物综合利用；农副产品销售；礼品花卉销售；豆及薯类销售；食品销售（仅销售预包装食品）；食用农产品初加工；非食用农产品初加工；食用农产品批发；日用百货销售；新鲜水果批发；互联网销售（除销售需要许可的商品）；。'>
          </a-card-meta>
        </a-card>

        <div class='tableTitle'></div>

        <a-card title='' :bordered='false' style='width: 300px;display: table-row;'>
          <a-tag color='#87d068'style='width: 50%;margin: 20px;'>
            产品信息
          </a-tag>
          <a-descriptions title=''>
            <a-descriptions-item label='产地'>
              {{ data.sourceBase }}
            </a-descriptions-item>
            <a-descriptions-item label='产品'>
              {{ data.variety }}
            </a-descriptions-item>

            <a-descriptions-item label='打包规格'>
              {{ data.packingSpecifications }}
            </a-descriptions-item>
            <a-descriptions-item label='等级'>
              {{ data.classes }}
            </a-descriptions-item>
            <a-descriptions-item label='单位'>
              {{ data.flowerPoleLength }}
            </a-descriptions-item>

            <a-descriptions-item label='数量'>
              {{ data.tagNum }}
            </a-descriptions-item>

            <a-descriptions-item label='包装员'>
              {{ data.packer }}
            </a-descriptions-item>
            <a-descriptions-item label='分拣日期'>
              {{ data.sortTime }}
            </a-descriptions-item>
            <a-descriptions-item label='入库时间'>
              {{ data.stockInTime }}
            </a-descriptions-item>
          </a-descriptions>
        </a-card>
        <div class='tableTitle'></div>

        <a-card title='' :bordered='false' style='width: 300px;display: inline;'>
          <a-tag color='#87d068' style='width: 50%;margin: 20px;'>
            记录
          </a-tag>
          <a-descriptions title=''>
            <a-descriptions-item label='扫码次数'>
              {{ data.scanTimes }}
            </a-descriptions-item>
          </a-descriptions>
        </a-card>

      </a-layout-content>
      <!--      <a-layout-footer>Footer</a-layout-footer>-->
    </a-layout>

  </div>
</template>


<script>
import { getAction  } from '@/api/manage'

export default {
  data() {
    return {
      loading: true,
      loadingMore: false,
      showLoadingMore: true,
      sid: '',
      data: {
        sourceBase: '',
        sourceGreenhouse: '',
        variety: '',
        classify: '',
        sorter: '',
        packer: '',
        sortTime: '',
        packingSpecifications: '',
        tagNum: 1,
        sortNum: 20,
        flowerPoleLength: '',
        classes: '',
        stockInTime: '',
        scanTimes: 0
      }
    }
  },
  created() {
    this.querySourceInfo()
  },
  mounted() {

  },
  methods: {
    querySourceInfo() {
      this.getUrlParam()
      // console.log(this.sid)
      const param = {
        id: ''
      }
      param.id = this.sid
      getAction("/flower/tagInfo/queryAndCountById",param).then((res) => {
        if (res.success) {
          let result = res.result
          this.data.sourceBase = result.sourceBase
          this.data.variety = result.variety
          this.data.classify = result.classify
          this.data.sorter = result.sorter
          this.data.packer = result.packer
          this.data.sortTime = result.sortTime
          this.data.packingSpecifications = result.packingSpecifications
          this.data.flowerPoleLength = result.flowerPoleLength
          this.data.classes = result.classes
          // this.data.tagNum = result.tagNum
          this.data.stockInTime = result.inTime
          this.data.scanTimes = result.scanTimes
        }
      })
    },
    getUrlParam() {
      let url = document.location.toString()
      let arrObj = url.split('?')

      if (arrObj.length > 1) {
        let arrPara = arrObj[1].split('=')
        this.sid = arrPara[1]
        // console.log(this.sid)
      }
    }

  }
}
</script>

<style scoped>
.main-layout {
  /*height: 100vh;*/
  background: #dcdfe6;
}

.demo-loadmore-list {
  width: 300px !important;
  display: inline;
}

#components-layout-demo-basic {
  text-align: center;
}

#components-layout-demo-basic .ant-layout-header {
  background: #ffffff;
  font-size: 20px;
  font-weight: bolder;
  height: 10%;
}

#components-layout-demo-basic .ant-layout-footer {
  background: #ffffff;
  max-height: 5%;
}

#components-layout-demo-basic .ant-layout-footer {
  line-height: 1.5;
}

#components-layout-demo-basic .ant-layout-content {
  background: #ffffff;
  /*height: 85%;*/
  margin-top: 1%;
  margin-bottom: 1%;
  /*line-height: 120px;*/
}

#components-layout-demo-basic > .ant-layout {
  margin-bottom: 48px;
}

#components-layout-demo-basic > .ant-layout:last-child {
  margin: 0;
}

.tableTitle {
  position: relative;
  margin: 0 auto;
  height: 1px;
  background-color: #d4d4d4;
  text-align: center;
  font-size: 16px;
  color: rgba(101, 101, 101, 1);
}

.ant-tag {
  font-size: 17px;
  /*float: left;*/
  font-weight: bolder;
  margin-bottom: 5px;
}

.ant-card-bordered {
  border: 0;
}

::v-deep .ant-card-cover {
  width: 50%;
  display: inline-block;
}

::v-deep .ant-card-head {
  border-bottom: 0 !important
}

::v-deep .ant-card-body {
  padding: 10px 24px 10px 24px;
}

::v-deep .ant-card-head-title {
  padding: 10px 0 10px 0;
}

::v-deep .ant-card-head-wrapper {
  float: left;
  font-weight: bolder;
}

::v-deep .ant-descriptions-item-label {
  display: inline-block;
  float: left;
  text-align: left;
  font-weight: bolder;
}

::v-deep .ant-descriptions-item-content {
  display: inline-block;
  float: right;
  text-align: right;
  margin-right: 10px;
}

/*::v-deep tbody {*/
/*  float: left;*/
/*  text-align: left;*/
/*}*/
</style>